<template>
  <div class="container">
    <div class="bg">
      <img src="../../assets/math.png" alt="">
    </div>
    <div class="inner">
      <a-row type="flex" justify="space-between">
        <a-col class="col">
            <span>15</span> 年
            <p>经验积累</p>
        </a-col>
        <a-col class="col">
            <span>40000</span>+
            <p>认证设计师</p>
        </a-col>
        <a-col class="col">
            <span>5000</span>+
            <p>供应链工厂</p>
        </a-col>
        <a-col class="col">
            <span>7000</span>+
            <p>成功案例</p>
        </a-col>
        <a-col class="col">
            <span>360</span>+
            <p>国际设计大奖</p>
        </a-col>
        <a-col class="col">
            <span>18</span> 个
            <p>城市运营中心</p>
        </a-col>
      </a-row>
    </div>
  </div>
</template>

<script>
  export default {
    name: "CompanyMath"
  }
</script>

<style scoped>
  .container{
    width: 100%;
    height: 200px;
    position: relative;
    overflow: hidden;
  }
  .bg{
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
  }
  .inner{
    position: absolute;
    left: 50%;
    top: 0;
    z-index: 6;
    width: 80%;
    height: 100%;
    /* margin: 0 auto; */
    transform: translate(-50%, 0);
  }
  .col{
    margin-top: 60px;
    font-size: 18px;
    color: #666;
  }
  .col span{
    font-size: 44px;
    font-weight: 800;
    color: #666;
    font-family: "微软雅黑",Arial;
  }
  .col p{
    padding-top: 10px;
    font-size: 14px;
    color: #666;
    text-align: center;
  }

</style>

